<template>
  <div class="main">
    <div class="class_type">
      <img src="@/assets/images/class_type.gif" alt="新闻中心" />
    </div>
    <div class="content">
      <table width="100%" align="center">
        <tr width="100%">
          <td colspan="2" align="center">
              <h3>{{news.ntitle}}</h3>
          </td>
        </tr>
        <tr>
          <td colspan="2"><hr /></td>
        </tr>
        <tr>
          <td align="center" style="width:50%">
            作者：{{news.nauthor}}
          </td>
          <td align="center" style="width:50%">发布时间：{{news.ncreatedate}}</td>
        </tr>
        <tr>
          <td colspan="2" align="center"></td>
        </tr>
        <tr>
          <td colspan="2">
            <div class="ncontent" v-html="news.ncontent">
              
            </div>
          </td>
        </tr>
        <tr>
          <td colspan="2"><hr /></td>
        </tr>
      </table>
      <br/>
      <comment-list :nid="$route.query.id"></comment-list>
      <br/>
      <comment-add v-if="userInfo != null" :uname="userInfo.uname" :nid="$route.query.id"></comment-add>
    </div>
  </div>
</template>

<script>
import CommentAdd from "./CommentAdd.vue";
import CommentList from "./CommentList.vue";

export default {
  data(){
    return {
      news:{
        ntitle:''
      },
      userInfo: JSON.parse(sessionStorage.getItem('token')) || null
    }
  },
  components: { CommentList, CommentAdd },
  created(){
    //添加注示
    this.readNews()
    if(sessionStorage.getItem('token') != null){
        this.userInfo = JSON.parse(sessionStorage.getItem('token')).user
    }
  },
  methods:{
    readNews(){
      this.$axios({
        url:'/api/showNews',
        params:{
          nid:this.$route.query.id
        }
      }).then(rs=>{
        console.log('ffff',rs.data)
        if(rs.data.code === 5200)
        this.news = rs.data.data
      })
    }
  },
  watch:{
    '$route':function(){
      this.readNews()
      if(sessionStorage.getItem('token') != null){
        this.userInfo = JSON.parse(sessionStorage.getItem('token')).user
      }
    }
  }
}
</script>

<style scoped>
.content {
  float: right;
  width: 787px;
  border-right: 1px solid #eff0f4;
  margin: 16px 0 0 10px;
}
  .ncontent{
    text-indent: 2em;
  }
</style>